<template>
  <!-- 树状列表组件 -->
  <div style="width:100%;height:100%;">
    <el-tree
      ref="catetreeone"
      :data="treedata"
      :expand-on-click-node="false"
      default-expand-all
      :highlight-current="true"
      :props="treePropstype"
      @node-click="handleSelectionChange"
    />
  </div>
  <!-- show-checkbox -->
</template>
<script>
import nowpagereq from "@/api/basic-info-manage/area";
export default {
  data() {
    return {
      treePropstype: {
        children: "facilityList",
        label: "facilityName"
      },
      treedata: [],
      facilityGroupList: [],
      facilityList: []
    };
  },
  mounted() {
    this.gettreelist();
    // setTimeout(() => {
    //   this.handleSelectionChange(this.treedata[0])
    // }, 1000);
  },
  methods: {
    handleSelectionChange(e) {
      this.$emit("treeselectvalue", e);
    },
    // 获取树状数据
    gettreelist() {
      nowpagereq.getshetaigouqulist().then(res => {
        let data = res.data;
        this.facilityGroupList = data.facilityGroupList;
        this.facilityList = data.facilityList;
        this.changetreedata();
      });
    },
    // 处理树状数据
    changetreedata() {
      let nothasgroup = [
        {
          facilityName: "未分组鱼塘",
          facilityList: this.facilityList
        }
      ];
      // console.log(nothasgroup)
      let hasgrouplist = [];
      if (this.facilityGroupList && this.facilityGroupList.length > 0) {
        hasgrouplist = this.facilityGroupList.filter(item => {
          item.facilityName = item.groupName;
          // 绑定key
          // facilityId
          let groupitem = {
            ...item
          };
          return groupitem;
        });
      }
      if (this.facilityList && this.facilityList[0]) {
        this.treedata = [...hasgrouplist, ...nothasgroup];
      } else {
        this.treedata = [...hasgrouplist];
      }

      this.handleSelectionChange(this.treedata[0].facilityList[0]);
    }
  }
};
</script>
